.log-main {
  width: 100%;
  height: 100vh;
  background: url(../img/index-bga01.jpg) center no-repeat;
  background-size: 100% auto;
  position: relative;
  .log-box,.register-box {
    width: r(564);
    margin-top: r(-232);
    .logo-rz {
      width: r(152);
      margin-bottom: r(42);
    }
    .main-content {
      border-radius: r(30);
      background:rgba(255, 255, 255, 0.1);
      border: 1px solid #5468ac;
      .input-box {
        width: r(450);
        margin-left: r(57);
        height: r(72);
        border-bottom: 1px solid #fff;
        position: relative;
        margin-top: r(24);
        span {
          display: block;
          width: r(78);
          height: r(72);
          float: left;
          text-align: center;
          line-height: r(72);
          color: #fff;
          font-size: r(48);
        }
        input {
          float: left;
          width: r(372);
          height: 100%;
          border: none;
          background: none;
          font-size: r(32);
          color: #fff;
          padding-left: r(12);
          padding-right: r(12);
          box-sizing: border-box;
        }
      }
      .log-self {
        width: r(450);
        margin-left: r(57);
        height: r(118);
        line-height: r(118);
        font-size: r(32);
        color: #fff;
        p {
          float: left;
        }
        .log-self-button{
          float: right;
        }
        .row {
          width: 100%;
          display: block;
          line-height: 60px;
          text-align: center;
          margin-top: r(12);
        }
        input[type="checkbox"] {
            display: none;
        }
        input[type="checkbox"] + label {
            display: inline-block;
            width: 48px;
            height: 25px;
            position: relative;
            -webkit-transition: 0.3s;
            transition: 0.3s;
            margin: 0px;
            box-sizing: border-box;
        }
        input[type="checkbox"] + label:after {
            content: '';
            display: block;
            position: absolute;
            left: 1px;
            top: 1px;
            width: 20px;
            height: 20px;
            -webkit-transition: 0.3s;
            transition: 0.3s;
            cursor: pointer;
        }
        #simple_2:checked + label.red{
            background: rgba($color: #8bddff, $alpha: 0.3);
        }
        #simple_2:checked + label.red:after{
            background: #24bfff;
        }
        #simple_2:checked + label:after{
            left: calc(100% - 21px);
        }
        #simple_2 + label{
            background: none;
            border-radius: 20px;
            border: 1px solid rgba($color: #ffffff, $alpha: 0.3);
        }
        #simple_2 + label:after {
            background: rgba($color: #ffffff, $alpha: 0.3);
            border-radius: 50%;
            box-shadow: 1px 1px 3px #aaa;
        }
      }
    }
    .submit {
      width: 100%;
      height: r(92);
      border-radius: r(30);
      line-height: r(92);
      background: rgba($color: #ffffff, $alpha: 0.8);
      border: none;
      text-align: center;
      font-size: r(48);
      margin-top: r(48);
      color: #091748;
    }
    .link-register {
      width: 100%;
      text-align: center;
      padding-top: r(52);
      p {
        display: inline-block;
        color: #8f92a1;
        font-size: r(32);
        line-height: r(32);
        padding-left: r(48);
        padding-right: r(48);
        &:first-child{
          color: #faffd5;
          border-right: 2px solid #fff;
        }
      }
    }
  }
  .register-box {
    .main-content {
      padding-bottom: r(12);
      padding-top: r(6);
      .input-box {
        margin-top: r(12);
        padding-bottom: r(12);
        &:last-child {
          border: none;
        }
      }
    }
    .link-register {
      p {
        &:first-child {
          border: none;
        }
      }
    }
  }
  .log-style {
    width: r(564);
    position: absolute;
    bottom: 5vh;
    ul li {
      width: r(136);
      height: r(136);
      border-radius: 200px;
      border: 1px solid rgba($color: #ffffff, $alpha: 0.5);
      margin-right: r(50);
      font-size: r(72);
      background:rgba($color: #ffffff, $alpha: 0.1);
      &:last-child {
        margin-right: 0;
        color: #5de627;
      }
    }
  }
}